<template>
    <a-spin :spinning="confirmLoading">
      <j-form-container :disabled="formDisabled">
        <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
          <a-row>
            <a-col :span="24">
             <!-- <span style="font-size: 20px;font-weight: bold;">选择申请部门</span> -->
            </a-col>
         
      
            <a-col :span="24">
            <a-form-model-item label="所属项目" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="projectId">
              <a-select :options="levelOneOptions" v-model="model.projectId " placeholder="请选择项目" @change="changeLevelOne"></a-select>
              <!-- <span style="color: red; font-size: 16px">请选择所属项目,此项为必填</span> -->
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="部门" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="departId">
              <a-select :options="levelTwoOptions" v-model="model.departId" placeholder="请选择项目"  @change="changeLevelTwo"></a-select>
              <!-- <span style="color: red; font-size: 16px">请选择所属项目,此项为必填</span> -->
            </a-form-model-item>
          </a-col>
          
           
          </a-row>
        </a-form-model>
      </j-form-container>
    </a-spin>
  </template>
    
    <script>
  import { httpAction, getAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  
  export default {
    name: 'WtBrandForm',
    components: {},
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false,
      },
    },
    data() {
      return {
        model: {},
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        confirmLoading: false,
        validatorRules: {},
        levelOneOptions:[],
        levelTwoOptions:[],
        treeData: [],
        warehouseId:'',
      departVal:'',
        url: {
          add: '/wtBrand/add',
          edit: '/wtBrand/edit',
          queryById: '/wtBrand/queryById',
        },
      }
    },
    computed: {
      formDisabled() {
        return this.disabled
      },
    },
    created() {
      //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model))
    },
    methods: {
      // loadTree() {
      //   var that = this
      //   getAction('/sys/sysDepart/queryTreeList').then((res) => {
      //     if (res.success) {
      //       that.treeData = []
            
      //       var treeList = res.result
      //       for (let a = 0; a < treeList.length; a++) {
      //         let temp = treeList[a].children
              
      //        for(let b = 0; b < temp.length; a++){
      //         console.log('rew3q2',temp[b]);
      //         let temp1 = temp[b]
           
      //         that.treeData.push(temp1)
      //        }
      //       }
  
  
      //     }
      //   })
      // },
      add() {
        this.edit(this.modelDefault)
      },
      edit(record) {
        this.model = Object.assign({}, record)
        this.visible = true
        // this.loadTree()
      },
      changeLevelOne(val) {
      // this.clearForm()
      this.model.departId = this.model.userId = ''
      // this.levelThreeOptions = []
    //  console.log('gfedw',val);
   
     this.getList('parentId', val)
    },
    changeLevelTwo(val) {
      // this.clearForm()
      // this.model.userId = ''
      this.getList1('id', val)
     this.departVal=val

    },
    getList(category, id) {
      getAction(`/sys/sysDepart/getDepartListByParentId?${category}=${id}`).then(res => {
        if (res.success) {
  
          this.treeData2 = []
          let treeList2 = res.result
          for (let a = 0; a < treeList2.length; a++) {
            let temp = treeList2[a]
            temp.isLeaf = temp.leaf
            this.treeData2.push(temp)
          }
        //  console.log('fdew',this.treeData2);
          this.levelTwoOptions = [...this.treeData2].map((v) => {
            return {
              ...v,
              value: v.id,
              label: v.departName,
            }
          })
        }
      })
    
      
    },
    getList1(category, id) {
      // this.clearForm()
     
      getAction(`/sys/sysDepart/getUsersByDepartId?${category}=${id}`).then((res)=>{
                 if (res.success) {
  
              this.treeData3 = []
              let treeList3 = res.result
              for (let a = 0; a < treeList3.length; a++) {
                let temp = treeList3[a]
                temp.isLeaf = temp.leaf
                this.treeData3.push(temp)
              }
             
              this.levelThreeOptions = [...this.treeData3].map((v) => {
                return {
                  ...v,
                  value: v.id,
                  label: v.realname,
                }
              })

            }
          })
    },
      handleOk() {
        const that = this
        // 触发表单验证
        // this.$refs.form.validate((valid) => {
        //   if (valid) {
        //     that.confirmLoading = true
        //     let httpurl = ''
        //     let method = ''
        //     if (!this.model.id) {
        //       httpurl += this.url.add
        //       method = 'post'
        //     } else {
        //       httpurl += this.url.edit
        //       method = 'put'
        //     }
        //     httpAction(httpurl, this.model, method)
        //       .then((res) => {
        //         if (res.success) {
        //           that.$message.success(res.message)
        //           that.$emit('ok')
        //         } else {
        //           that.$message.warning(res.message)
        //         }
        //       })
        //       .finally(() => {
        //         that.confirmLoading = false
        //       })
        //   }
        // })
      },
      submitForm() {
        const that = this
        // 触发表单验证
        this.$refs.form.validate((valid) => {
          if (valid) {
            that.confirmLoading = true
            let httpurl = ''
            let method = ''
            if (!this.model.id) {
              httpurl += this.url.add
              method = 'post'
            } else {
              httpurl += this.url.edit
              method = 'put'
            }
            httpAction(httpurl, this.model, method)
              .then((res) => {
                if (res.success) {
                  that.$message.success(res.message)
                  that.$emit('ok')
                } else {
                  that.$message.warning(res.message)
                }
              })
              .finally(() => {
                that.confirmLoading = false
              })
          }
        })
      },
    },
  }
  </script>